{% extends "base.html" %} {% block link %}
<link
      href="{{ url_for('static', filename='css/editor@5.1.23.css') }}"
      rel="stylesheet"
    />
<script src="{{ url_for('static',filename='/js/@wangeditor.js') }}"></script>
{% endblock %}{% block title %}发布新文章{% endblock %} {% block content %}
<main>
  <h2 class="edit_title">文章发布</h2>
  <form class="editor" action="{{ url_for("news.news_edit") }}" method="post" >
    {{ form.hidden_tag() }}
    {{ form.title.label }} <br />
    {{ form.title(size=20,class="article_title") }}<br />
    {{ form.subset_id.label }} <br />
    {{ form.subset_id() }}
    <label for="title">文章正文: </label> <br />
    {{ form.content() }}
    <div class="editor—wrapper">
    <div class="toolbar-container"><!-- 工具栏 --></div>
    <div class="editor-container"><!-- 编辑器 --></div>
  </div>
    <!-- 存储编辑器内容 -->
     <div class="button-container">{{ form.submit() }}</div>
  </form>
  
  <script>
      const { createEditor, createToolbar } = window.wangEditor
      const content = document.getElementById("content");
      
      const editorConfig = {
        placeholder: '请输入文章内容',
        onChange(editor) {
          content.value = editor.getHtml()
        },
      }

      const editor = createEditor({
        selector: '.editor-container',
        html: '<p><br></p>',
        config: editorConfig,
        mode: 'default', // or 'simple'
      })

      const toolbarConfig = {}

      const toolbar = createToolbar({
        editor,
        selector: '.toolbar-container',
        config: toolbarConfig,
        mode: 'default', // or 'simple'
      })
    </script>
</main>
{% endblock %}
